<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh">
<head>
<title>文件上传</title>
<jsp:include page="/WEB-INF/view/commons/css.jsp" />
    <link rel="stylesheet" href="static/plugin/jquery-fileupload/css/jquery.fileupload.css"/>
</head>
<div id="main-container" class="container-fluid">
    <div class="panel panel-info">
        <form class="form-horizontal">
            <div class="form-group">
                <label  class="col-sm-2 control-label">选择权限文件：</label>
                <div class="col-md-5 fileinput-div">
                    <span class="btn btn-sm btn-success fileinput-button">
                        <i class="fa fa-folder-open"></i>
                        <span>选择文件...</span>
                    <input class='upload' type="file" name="the_files" data-imp-url="syspermission/batchImport">
                    </span>
                    <button  type="button" class="btn btn-sm btn-primary upload-file hidden"><i class="icon-upload"></i>导入</button>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-10">
                    <div class="upload_msg"></div>
                </div>
            </div>
        </form>

	</div>
</div>
<!--/.fluid-container#main-container-->
<!-- script start -->
<jsp:include page="/WEB-INF/view/commons/js.jsp" />
<script src="static/plugin/jquery-fileupload/js/vendor/jquery.ui.widget.js"></script>
<script src="static/plugin/jquery-fileupload/js/jquery.iframe-transport.js"></script>
<script src="static/plugin/jquery-fileupload/js/jquery.fileupload.js"></script>
<script type="text/javascript">
    $(document).ready(function(e) {
        $('.upload').fileupload({
            url:'common/uploadFiles',
            dataType: 'json',
            formData:{moduleDir:'permission'},
            add: function (e, data) {
                var file = data.files[0];
                $(this).prev('span').text(file.name);
                $(this).closest('.fileinput-div').find('button.upload-file')
                    .removeClass('hidden')
                    .click(function () {
                        data.submit();
                    });
                $(this).closest('.form-group').next().find('.upload_msg').html("").hide();
            },
            done: function (e, data) {
                var _this = $(this);
                var res = data.result;
                if(res.success){
                    $(this).prev('span').text("选择文件...");
                    $(this).closest('.fileinput-div').find('button.upload-file').addClass('hidden');
                    top.loading("文件上传成功，后台正在处理请耐心等待.....");
                    var param = {};
                    param.filePath=res.data.path;
                    var url = $(this).data("impUrl");
                    if(url){
                        $.post(url, param, function(res){
                            top.loaded();
                            layer.alert(res.msg ? res.msg : "导入失败");
                        }).error(function() {
                            top.loaded();
                            layer.alert("上传失败");
                        });
                    }

                }else{
                    layer.alert(res.msg ? res.msg : "上传失败");
                }
            },
            start:function(e, data){
                top.loading("文件上传中请耐心等待.....");
            },
            fail:function(){
                top.loaded();
            }
        });

    });
</script>
<!-- script end -->
</body>
</html>
